<extend name="template/base_index" />

<block name="area_header">
	<link rel="stylesheet" type="text/css" media="all" href="__CDN__/jquery-datetimepicker/jquery.datetimepicker.css">
	<script type="text/javascript" src="__CDN__/jquery-datetimepicker/jquery.datetimepicker.js"></script>
	<link type="text/css" rel="stylesheet" href="__CDN__/select2/4.0.0/css/select2.min.css" />
	<link type="text/css" rel="stylesheet" href="__CDN__/select2/4.0.0/css/cosmo-skin.css" />
    <script type="text/javascript" src="__CDN__/sco1.0.2-8/js/sco.countdown.js"></script>

</block>

<block name="area_body">
	{:W('Menus/topbar')}
	<div class="admin-main container-fluid">
		{:W('Menus/left')}
		<div class="admin-main-content">
			{:W('Menus/breadcrumb')}
			<!-- 过滤\查询按钮 -->
			<div class="filter-controls">
				{:W('OrgArea/area')}
				<!-- 日期查询 -->
				<form action="{:U('Admin/Orders/sure')}" method="post" class="searchForm form-inline">
					<div class="form-group row   col-lg-12 col-md-12">
						<div class="input-group">
							<div class="input-group-addon">下单用户</div>
							<select style="width:220px;padding: 10px 15px;font-size: 15px;line-height: 1.42857143;" id="user_select2" name="uid" class="">
								<option></option>
							</select>
						</div>

					</div>
					<div class="form-group row   col-lg-12 col-md-12">
						<div class="input-group">
							<div class="input-group-addon">订单编号</div>
							<input type="text" name="order_code" placeholder="输入2015，可查询前缀为2015的订单" class="form-control" value="{$order_code}" />

						</div>

						<button type="submit" class="btn btn-default"><i class="fa fa-search"></i>{:L('BTN_SEARCH')}</button>
						<button type="button" id="autoRefresh" class="btn btn-warning"><i class="fa fa-refresh"></i><span class="txt">自动刷新</span><span class="countdown"></span></button>
					</div>
					<div class="form-group row col-lg-12 col-md-12">
						<div class="input-group " style="  width: 860px;">

							<div class="input-group-addon">支付状态</div>
							<div class="form-control ">
								<label class="radio-inline">
									<input type="radio" name="payStatus" class="payStatus" <eq name="payStatus" value="">checked="checked"</eq> value="">不限
								</label>
								<label class="radio-inline">
									<input type="radio" name="payStatus" class="payStatus" <eq name="payStatus" value="0">checked="checked"</eq> value="0">待付款
								</label>
								<label class="radio-inline">
									<input type="radio" name="payStatus" class="payStatus" <eq name="payStatus" value="1">checked="checked"</eq> value="1">已支付
								</label>
								<label class="radio-inline hide">
									<input type="radio" name="payStatus" class="payStatus" <eq name="payStatus" value="5">checked="checked"</eq> value="5">货到付款
								</label>
								
							</div>
						</div>
					</div>
				</form>
			</div>
			<!-- 操作按钮 -->
			<div class="btn-controls">
				<!--<a class="btn btn-primary btn-sm" href="{:U('Admin/Orders/print')}"><i class="fa fa-plus"></i>打印</a>-->
				<!--<a target-form="selectitem" class="btn btn-danger btn-sm ajax-post confirm" href="{:U('Admin/Product/bulkDelete')}"><i class="fa fa-trash"></i>{:L('BTN_DELETE')}</a>-->
				<a id="btnSure" target-form="selectitem" href="{:U('Admin/Orders/bulkSure')}" class="btn btn-primary ajax-post confirm "><i class="fa fa-check"></i>确认订单</a>
			</div>

			<table class="table table-striped table table-hover  table-condensed">
				<thead>
					<tr>
						<th>
							<input type="checkbox" class="selectall" onclick="myUtils.selectall(this,'.selectitem');" />
						</th>
						<th>
							订单编号
						</th>
						<th>
							下单用户
						</th>
						<th>
							收货人
						</th>
						<th>
							联系电话
						</th>
						<th>
							总价格(元)
						</th>
						<th>
							邮费(元)
						</th>
						<th>
							邮寄地址
						</th>
						<th>
							订单状态
						</th>
						<th>
							下单时间
						</th>
					</tr>
				</thead>
				<tbody>
					<empty name="list">
						<tr>
							<td colspan="10" class="text-center">{:L('NO_DATA')}</td>
						</tr>
						<else/>
						<volist name="list" id="vo">
							<tr>
								<td>
									<input type="checkbox" value="{$vo.order_code}" name="order_codes[]" class="selectitem" />
								</td>
								<td>
									<a href="{:U('Admin/Orders/view',array('id'=>$vo['id']))}">{$vo.order_code}</a>
								</td>
								<td>
									<a href="{:U('Admin/CustomerInfo/index',array('id'=>$vo['uid']))}">{$vo.username}</a>
								</td>
								<td>
									{$vo.contactname}
								</td>
								<td>
									{$vo.mobile}
								</td>
								<td>
									{$vo['price']}
								</td>
								<td>
									{$vo['post_price']}
								</td>
								<td>{$vo.province},{$vo.city},{$vo.area},{$vo.detailinfo}
								</td>
								<td>
									[{$vo.pay_status|getPayStatus}]
								</td>
								<td>
									{$vo.createtime|date='Y-m-d H:i:s',###}
								</td>
								<td>
									<a class="btn btn-default btn-sm" href="{:U('Admin/Orders/editorder',array('id'=>$vo['id'],'price'=>$vo['price'],'postprice'=>$vo['post_price']))}" ><i class="fa fa-edit"></i>修改订单</a>
									<button class="btn btn-primary btn-sm" type="button" data-toggle="modal" data-orderid="{$vo.id}" data-target="#cancelModel"><i class="fa fa-reply"></i>退回订单</button>
								</td>
							</tr>

						</volist>
					</empty>
				</tbody>
			</table>
			<div>{$show}</div>
			
			<div class="modal fade" id="cancelModel" tabindex="-1" role="dialog" aria-labelledby="cancelModelLabel" aria-hidden="true">
			  <div class="modal-dialog" style="z-index: 12345678;">
			    <div class="modal-content">
			      <div class="modal-header">
			        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
			        <h4 class="modal-title" id="exampleModalLabel">退回订单原因</h4>
			      </div>
			      <div class="modal-body">
			        <form class="cancelOrderForm" action="{:U('Admin/Orders/backOrder')}">
			        	<input type="hidden" name="orderid" id="orderid" value="" />
			          <!--<div class="form-group">
			            <label for="recipient-name" class="control-label">订单ID:</label>
			            <input type="text" class="form-control" id="orderId">
			          </div>-->
			          <div class="form-group">
			            <label for="message-text" class="control-label">原因:</label>
			            <textarea class="form-control" rows="5" name="reason" id="message-text"></textarea>
			          </div>
			        </form>
			      </div>
			      <div class="modal-footer">
			        <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-close"></i>关闭</button>
			        <button type="button" url="{:U('Admin/Orders/backOrder')}" target-form="cancelOrderForm" class="ajax-post btn btn-primary"><i class="fa fa-save"></i>保存</button>
			      </div>
			    </div>
			  </div>
			</div>
			<script type="text/javascript">
			$('#cancelModel').on('show.bs.modal', function (event) {
			  var button = $(event.relatedTarget); // Button that triggered the modal
			  var orderid = button.data('orderid'); // Extract info from data-* attributes
			  var modal = $(this);
//			  modal.find('.modal-title').text('New message to ' + recipient);
			  modal.find('.modal-body #orderid').val(orderid);
			})
				$(function() {
//							$(".orderstatus").click(function(){
//								$(".searchForm").submit();
//							});
//							$(".paystatus").click(function(){
//								$(".searchForm").submit();
//							})
//							if({$orderStatus} == 3){
//								$("#btnDeliver").show();
//								$("#btnSure").hide();
//							}else{
//								$("#btnDeliver").hide();		
//								$("#btnSure").show();					
//							}
					});
			</script>
		</div>
		<!-- END admin-main-content -->
	</div>
	<!-- END admin-main-->
</block>

<block name="area_footer">

	<script src="__CDN__/jquery-cookie/1.4.1/jquery.cookie.js"></script>
	<script src="__CDN__/select2/4.0.0/js/select2.min.js"></script>
	<script src="__CDN__/select2/4.0.0/js/i18n/zh-CN.js"></script>
	<script type="text/javascript">
		$(function(){
		 $('a.num').each(function(){
		 $(this).attr('href',$(this).attr('href')+"?payStatus={$payStatus}");
		 })

		 $('a.next').each(function(){
		 $(this).attr('href',$(this).attr('href')+"?payStatus={$payStatus}");
		 })

		 $('a.prev').each(function(){
		 $(this).attr('href',$(this).attr('href')+"?payStatus={$payStatus}");
		 })

		 })

		function cancelOrder(){
			$('#cancelModal').on('show.bs.modal', function (event) {
			  var button = $(event.relatedTarget) // Button that triggered the modal
			  var recipient = button.data('whatever') // Extract info from data-* attributes
			  // If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
			  // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
			  var modal = $(this);
			  modal.find('.modal-title').text('New message to ' + recipient)
			  modal.find('.modal-body input').val(recipient)
			})
		}
		
		function autoRefresh(){
			var refreshFlag = $.cookie('autoRefresh'); 
			if(refreshFlag == "false"){
				return ;
			}
			
			window.location.href = "__SELF__";
		}
		
		$(function(){
            var refresh = 10000;
			$(".payStatus").click(function(){
				$(".searchForm").submit();
			});
			cancelOrder();
            var until =  {:(time()+10)};
			var refreshFlag = $.cookie('autoRefresh'); 
			if(refreshFlag == "true"){
                $('#autoRefresh .countdown').scojs_countdown({until: until});
				var interval = setTimeout(function(){
					autoRefresh();
				},refresh);
				$("#autoRefresh .txt").text("停止刷新");
				$("#autoRefresh i").removeClass("fa-refresh").addClass("fa-times-circle");
			}

			$("#autoRefresh").click(function(){
				var refreshFlag = $.cookie('autoRefresh'); 
				if(refreshFlag == "true"){
					$("#autoRefresh .txt").text("自动刷新");
					$("#autoRefresh i").addClass("fa-refresh").removeClass("fa-times-circle");
					$.cookie("autoRefresh","false");
				}else{
					$.cookie("autoRefresh","true");
					$("#autoRefresh .txt").text("停止刷新");
					$("#autoRefresh i").removeClass("fa-refresh").addClass("fa-times-circle");
				}
				
				autoRefresh();
			})
			
			$("#user_select2").select2({
				placeholder: "输入用户id或昵称查询"	,
				language: "zh-CN",
				ajax: {
				    url: "{:U('Admin/Member/select')}",
				    dataType: 'json',
				    delay: 250,
				    data: function (params) {
				    	var queryParameters = {
					      q: params.term
					    }
	    				return queryParameters;
				      
				    },
				    processResults: function (data, page) {
				    	if(!data.info){
				    		data.info = new Array();
				    		data.info['nodata']="无相关数据";
				    	}
				      	// parse the results into the format expected by Select2.
				      	// since we are using custom formatting functions we do not need to
				      	// alter the remote JSON data
				      	return {
				        	results: data.info
				      	};
				    },
				    cache: true
			  	}, 
				  	minimumInputLength: 0,
					templateSelection: function (repo) {	
		  				return repo.nickname || repo.text;
					},
				  templateResult: function (repo) {
				   		
	      				if (repo.loading) return repo.text;
						if(repo.nodata) return repo.nodata;
	//    				var markup = '<div>'+repo.nickname+'</div>';
	      				var markup = '<div><img src="'+repo.head+'" style="width:30px;height:30px;"/>[id:'+repo.id+'] '+repo.nickname+'</div>';
	      				return $(markup);
	    			},
			});
		});
	</script>

</block>